<template>
  <!--设备工具-->
  <basic-dialog v-model="dialog.showDialog" :title="dialog.title" width="1700"
                :autoClose="true" :hideFooter="true">
    <el-splitter>
      <el-splitter-panel :size="900" style="padding-right: 10px">
        <basic-crud  ref="crudRef" :option="materialOptions" :row-style="rowStyle"
                     apiGetListUrl="/mes/processTaskController/listMpmDefineDeviceByProcess"
                     :defaultListParams="{processTaskId:parentRow.id}" :pageData="{pageSize:-1}"
                     :fastSearch="{name:'型号、名称',fastColumn:'specification,name'}"
                     @row-click="handleRowClick">
          <template #menu="{row}">
            <el-button type="primary" text icon="plus" @click="addBtnClick(row)">新增</el-button>
          </template>
        </basic-crud>
      </el-splitter-panel>
      <el-splitter-panel :min="600" style="padding-left: 10px">
        <basic-crud  ref="assemblyCrudRef" :option="assemblyOptions"
                     apiGetListUrl="/mes/processTaskController/listLinkedDeviceByProcess"
                     :defaultListParams="{processTaskId:parentRow.id}" :pageData="{pageSize:-1}" :autoLoad="false"
                     :fastSearch="{name:'实物编号、名称',fastColumn:'code,name'}"
                     :apiListParams="listParams" @row-del="removeHandler">
        </basic-crud>
      </el-splitter-panel>
    </el-splitter>
    <DeviceSelect ref="deviceSelectRefs" @refresh-parent="getRightList"></DeviceSelect>
  </basic-dialog>
</template>

<script setup>
import {defineExpose} from "vue";
import {ElMessage} from "element-plus";
import DeviceSelect from "@/views/mes/techne/DeviceSelect.vue";
import {apiPostRemoveByBus} from "@/apis/device/deviceBorrowBill";

const emits = defineEmits(['refresh-parent'])

const dialog = ref({
  showDialog: false,
  title: "设备工具"
})
const parentRow = ref({});
const parentOnlyShow = ref(false);
// 打开新增编辑对话框
const openDialog = (row, onlyShow) => {
  dialog.value.showDialog = true;
  parentRow.value=row;
  parentOnlyShow.value=onlyShow

  materialOptions.value.menu= !onlyShow
  assemblyOptions.value.delBtn= !onlyShow
};

const crudRef=ref(null);
const assemblyCrudRef=ref(null);
const closeDialog=()=> {
  crudRef.value.defaultSelectList = [];
  assemblyCrudRef.value.tableData = [];
  emits('refresh-parent')
}

const materialOptions= ref({
  addBtn: false,
  editBtn:false,
  delBtn:false,
  viewBtn:false,
  align: "center",
  height: "570px",
  menu: !parentOnlyShow.value,
  menuWidth:65,
  showPage:false,
  column: [
    {
      label: "型号",
      prop: "specification",
      width: 150,
      sortable: true
    },
    {
      label: "名称",
      prop: "name",
      width: 150,
      sortable: true,
    },
    {
      label: "类型",
      prop: "type",
      width: 80,
      sortable: true
    },
    {
      label: "供应商",
      prop: "supplier",
      width: 120
    }, {
      label: "参数",
      prop: "params",
      width: 130
    },/*{
              label:'工序/工步',
              prop: 'processName',
              width: 180,
              formatter:(val)=>{
                 return val.processCode + " " + val.processName;
              },
              overHidden:true
            },*/
    {
      label: "备注",
      prop: "remark",
    },
  ]
})

const listParams=ref({})
const assemblyOptions= ref({
  addBtn: false,
  editBtn:false,
  delBtn:false,
  align: "center",
  height: "570px",
  menuWidth: 65,
  showPage:false,
  column: [
    {
      label: "实物编号",
      prop: "code",
      minWidth: 160,
      fixed: 'left',
      sortable: true,
    },
    {
      label: "有效期",
      prop: "effectiveDate",
      type: 'date',
      format: 'yyyy-MM-dd',
      width: 120,
      sortable: true,
      formatter: (row) => new Date(row.effectiveDate).getFullYear() >= 2099 ? '/' : formatDate(row.effectiveDate, "yyyy-MM-dd")
    }, {
      label: "型号",
      prop: "specification",
      width: 150,
      sortable: true
    },
    {
      label: "名称",
      prop: "name",
      width: 150,
      sortable: true,
    },
  ]
})
const deviceSelectRefs=ref(null)

const handleRowClick=(row) =>{
  listParams.value={
    deviceId:row.mesId
  }
}

const addBtnClick=(row)=> {
  const data= {
    processTaskId: parentRow.value.id,
    bus: parentRow.value.bus,
    ...row
  }
  deviceSelectRefs.value?.openDialog(data, parentOnlyShow);
}
const removeLoading=ref(false)
const removeHandler=(row)=> {
  let submitData = {
    useBus: parentRow.value.bus,
    useBusId: parentRow.value.id,
    billDTO: {
      deviceBorrowItemDTOList: [{
        deviceAccountId: row.id
      }],
    },
  };
  apiPostRemoveByBus(submitData,removeLoading).then((res) => {
    ElMessage.success("移除使用设备成功");
    getRightList();
  });
}
const getRightList=()=>{
  assemblyCrudRef.value.getList()
  emits('refresh-parent')
}

const rowStyle=({row})=> {
  if (row.usedFlag) {
    return {
      backgroundColor: '#aab4b4',
      color: '#030303'
    };
  }
  return null;
}
defineExpose({
  openDialog
})
</script>

<style scoped>

</style>